<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        .eer{
            color: red;
        }
        .suc{
            color: aquamarine;
        }
    </style>
</head>
<body>
    <input type="text" id="name"><span id="er-name"></span>
    <button>ok</button>
</body>
<script>
    var ername=document.getElementById('er-name');
    var btn=document.getElementsByTagName('button')[0];
    btn.onclick=function(e){
        var name =document.getElementById('name');
        var reg=/ad/;
        if (!reg.test(name.value)) {
            ername.innerHTML='账号有误';
            ername.className='eer';
            return;
        }
        ername.innerHTML='账号正确';
        ername.className='suc';
    }
    var name2=document.getElementById('name');
    name2.onblur=function(e){
        /* {}大括号 | 量词符. 里面表示重复次数 
        []中括号 | 匹配方括号中的任意字符.   
        ()小括号 | 表示优先级 */
        /* 
        | *     | 连续出现0次或更多次 |
        | +     | 连续出现1次或更多次 |
        | ?     | 出现0次或1次    |
        | {n}   | 连续出现n次         |
        | {n,}  | 连续出现n次或更多次 |
        | {n,m} | 连续出现n到m次 */
        var reg=/^ad/;//表示是否以ad开头
        var reg1=/ad$/;//表示是否以ad结尾
        var reg2=/^ad$/;//精确匹配,表示是否相同
        console.log(reg.test(this.value));
        var reg3=/[a-z]/;//是否包含小写字母的任意一个
        var reg4=/[0-9]/;//是否包含数字
        var reg5=/[A-Z]/;//是否包含大写字母的任意一个
        var reg6=/[A-Z0-9a-z]/;//是否包含任意字母或数字
        console.log(reg6.test(this.value));
        var reg7=/[0-9]{2,3}/;
        var reg8=/[0-9]*/;
        // var reg8=/[0-9]+/;
        // var reg8=/[0-9]?/;
        var reg9=/^[0-9]?$/;//精确匹配并判断
        console.log(reg9.test(this.value));

        //(\d)一个小括号代表一个匹配规则
        var reg10=/(\d)(\w)/;//括号里的规则都得满足
        // var reg10=/(\d\w)/;
        console.log(reg10.test(this.value));
    }
</script>
</html>